<template>
  <!-- 积分流水 -->
  <view class="load" v-if="!load">
    <u-loading-icon
      mode="circle"
      inactive-color="#fff"
      text="正在加载..."
      vertical
    ></u-loading-icon>
  </view>
  <view class="balance" v-else>
    <view class="topbox">
      <view class="integralbox">
        <view class="box_4">
          <view class="myHuiDou">
            <text lines="1" class="text_3">{{ userNums.Score || 0 }}</text>
            <view class="image-text_1">
              <image
                src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17154078448911461.png"
                class="thumbnail_4"
              ></image>
              <text lines="1" class="text-group_1">我的挥豆</text>
            </view>
          </view>
          <view class="payHuiDouNav" v-if="$util.getSystemUtils(true)!='ios'" @click="nav_to('/pages/user/payHuiDou')">
            <text lines="1" class="text_4">充值挥豆</text>
          </view>
					<view class="payHuiDouNav" v-else @click="$util.getSystemUtils(false,false)">
					  <text lines="1" class="text_4">获取挥豆</text>
					</view>
        </view>
      </view>
    </view>

    <view class="navList">
      <view class="navContent">
        <text
          lines="1"
          class="text_5"
          :class="{ navActive: navIndexValue == index }"
          @click="navIndex(index)"
          v-for="(item,index) in navMenu" :key="index"
          >{{item}}</text
        >
      </view>
    </view>

    <view class="getHuiDou" v-if="navIndexValue == 0">
      <view class="dayTask">
        <view class="thumbnail_5"></view>
        <text lines="1" class="text_Title">日常任务</text>
      </view>
      <view class="box_item">
        <view class="text-group">
          <text lines="1" class="text_Title">邀请好友</text>
          <text lines="1" class="text_des">每邀请一位好友，可获得3挥豆</text>
        </view>
        <view class="text-wrapper_btn" @click="nav_to('/pages/user/spread')">
          <text lines="1" class="text_btn">去完成</text>
        </view>
      </view>
      <view class="box_item">
        <view class="text-group">
          <text lines="1" class="text_Title" >每日签到</text>
          <text lines="1" class="text_des">每日签到，可获得1挥豆</text>
        </view>
        <view class="text-wrapper_btn" :class="{diyBg:signedToday}" @click="daySign">
          <text lines="1" class="text_btn" :class="{diyColor:signedToday}">{{signedToday?"已签到":"去完成"}}</text>
        </view>
      </view>
      <view class="dayTask marginTopDay">
        <view class="thumbnail_5"></view>
        <text lines="1" class="text_Title">奖励任务</text>
      </view>
      <view class="box_item">
        <view class="text-group">
          <text lines="1" class="text_Title">发布组局</text>
          <text lines="1" class="text_des">发布组局，可获得1挥豆</text>
        </view>
        <view class="text-wrapper_btn"  @click="nav_to('/pages/ball/ball_add?golfType=0')">
          <text lines="1" class="text_btn">去发布</text>
        </view>
      </view>
      <view class="box_item">
        <view class="text-group">
          <text lines="1" class="text_Title">完善联系方式</text>
          <text lines="1" class="text_des">完善联系方式，可获得5挥豆</text>
        </view>
        <view class="text-wrapper_btn" :class="{diyBg:isFillUser}" @click="goEdit">
          <text lines="1" class="text_btn" :class="{diyColor:isFillUser}">{{isFillUser?"已完善":"去完善"}}</text>
        </view>
      </view>
    </view>

    <view class="getHuiDou" v-if="navIndexValue == 1">
      <view class="box_item" style="margin-top: 10rpx">
        <view class="text-group">
          <text lines="1" class="text_Title">发布组局</text>
          <text lines="1" class="text_des">每发布一个组局，消耗1挥豆</text>
        </view>
      </view>
      <view class="box_item">
        <view class="text-group">
          <text lines="1" class="text_Title">报名组局</text>
          <text lines="1" class="text_des">每报名一次组局，消耗1挥豆</text>
        </view>
      </view>
      <view class="box_item" style="border-bottom: none">
        <view class="text-group">
          <text lines="1" class="text_Title">删除聚农优品动态备份</text>
          <text lines="1" class="text_des">每删除一个聚农优品动态，消耗3挥豆</text>
        </view>
      </view>
    </view>

    <view class="bg" v-if="navIndexValue == 2">
      <view class="item row" v-for="(item, index) in list" :key="index">
        <view class="col_18">
          <view class="type">{{ item.Type }}</view>
          <view class="time">{{ getDataTime(item.CreateTime) }}</view>
        </view>
        <view
          class="col_6 f1 num"
          :class="{ add: item.Score > 0, reduce: item.Score < 0 }"
        >
          {{ item.Score }}
        </view>
      </view>
    </view>
    <u-empty
      v-if="navIndexValue == 2"
      mode="list"
      :show="Array.isArray(list) && list.length == 0"
      iconSize="32"
      text="暂无数据"
    ></u-empty>

    <uni-popup type="center" ref="signbox">
			<view class="sign_box">
				<view class="sign_img">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/1715827125446882.png" mode="widthFix"></image>
				</view>
				<view class="sign_info">
					<view class="sign_tit">
						签到成功
					</view>
					<view class="sign_num">
						<view class="num_icon">
							<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17152497707051371.png" mode="aspectFill"></image>
						</view>
						<view class="num_count">
							+1	
						</view>
					</view>
					<view class="sign_lit">
						邀请好友可获得更多挥豆
					</view>
					<view class="sign_btn"  @click="user.IsAuth == 0?nav_to('/pages/start/start2') : nav_to('/pages/user/spread')">
						去邀请
					</view>
				</view>
				<view class="sign_close" @click="$refs.signbox.close()">
					<image src="https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/17158306571711407.png" mode="aspectFill"></image>
				</view>
			</view>
		</uni-popup>
  </view>
</template>

<script>
export default {
  data() {
    return {
      navMenu:['获得挥豆','挥豆用途','挥豆明细'],
      load: false,
      list: [],
      userNums: {},
      navIndexValue: 0,
      user:{},
      signedToday: false, // 默认今天未签到
      isFillUser: false
    };
  },
  onLoad(){
    this.user = uni.getStorageSync('user')
    // 页面加载时检查本地存储中的签到状态
    this.checkIfSignedToday();
    this.isFillUserInfo().then(result => {
      this.isFillUser = result
    });

  },
  onShow() {
    this.init();
  },
  methods: {
    async init() {
      this.list = [];
      this.getList();
      this.getSaleChannelDetail();
    },
    navIndex(index) {
      this.navIndexValue = index;
    },
    setCurrIndex(ind) {
      this.currIndex = ind;
    },
    async getList() {
      let res = await this.$api.post("SaleChannel/GetUserScoreLog");
      if(res.code == 0){
        this.list = res.data;
        this.load = true;
      }else{
        this.$pv.msg(res.message)
      }
    },
    async getSaleChannelDetail() {
      let res = await this.$api.post("/SaleChannel/SaleChannelDetail", {
        CompanyID: 6003,
      });
      if(res.code==0){
        this.userNums = res.data;
      }else{
        this.$pv.msg(res.message)
      }
    },
    // 签到
    async daySign() {
      if (!this.signedToday) { // 检查今天是否已经签到
        let res = await this.$api.post("Member/DaySign");
        if (res.code === 0) {
          this.$refs.signbox.open();
          this.userNums.Score++
          this.signedToday = true; // 设置为已签到
        }
      } else {
        // 提示用户今天已经签到过了
        this.$pv.msg('今天已经签到过啦')
      }
    },
    async checkIfSignedToday() {
      let res = await this.$api.post("Member/IsDaySign")
      if(res.code != 0){
        this.signedToday = true;
        return;
      }
     this.signedToday = false;
    },
    async isFillUserInfo() {
        try {
          let u = uni.getStorageSync('user');
          if (!u || !u.UserID) {
            return false;
          }

          let res = await this.$api.post('User/GetUserInfo', {
            ID: u.UserID
          });

          if (res.code == 0) {
            return (res.data.Phone && res.data.WechatNo) ? true : false;
          }
          return false;
        } catch (error) {
          console.error(error);
        return false;
      }
    },
    goEdit(){
      if(!this.isFillUser){
        this.nav_to('/pages/user/user_edit')
      }else{
        this.$pv.msg("您已经完善过信息了")
      }
    }
  },
  computed: {
    getDataTime() {
      return (l) => {
        let d = new Date(l);
        let timestamp = d.getTime();
        return this.$u.date(timestamp, "yyyy年mm月dd日 hh时MM分");
      };
    },
  },
};
</script>

<style lang="scss">
page {
  background-color: #f6f6f6;
  height: 100vh;
}

.balance {
  padding-bottom: 80rpx;
  .topbox {
    width: 100%;
    height: 260rpx;
    // text-align: center;
    background: #f6f6f6;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    .integralbox {
      position: relative;
      width: 702rpx;
      height: 216rpx;
      background-color: #fff;
      border-radius: 24rpx;
      margin: 0 auto;
      .box_4 {
        background: url(https://golfdate.oss-cn-shenzhen.aliyuncs.com/upload/1715407748259402.png)
          100% no-repeat;
        background-size: 100% 100%;
        align-self: center;
        flex-direction: row;
        display: flex;
        justify-content: space-between;
        padding: 32rpx;
        .myHuiDou {
          display: flex;
          flex-direction: column;
          .text_3 {
            overflow-wrap: break-word;
            color: rgba(51, 51, 51, 1);
            font-size: 96rpx;
            font-family: PingFang-SC-Bold;
            font-weight: normal;
            text-align: left;
            white-space: nowrap;
            line-height: 120rpx;
            margin-right: 44rpx;
          }
          .image-text_1 {
            width: 160rpx;
            flex-direction: row;
            display: flex;
            justify-content: space-between;
            .thumbnail_4 {
              width: 40rpx;
              height: 40rpx;
            }
            .text-group_1 {
              overflow-wrap: break-word;
              color: rgba(51, 51, 51, 1);
              font-size: 28rpx;
              font-family: PingFang-SC-Medium;
              font-weight: normal;
              text-align: left;
              white-space: nowrap;
              line-height: 40rpx;
            }
          }
        }
        .payHuiDouNav {
          background-color: rgba(112, 110, 238, 1);
          border-radius: 36rpx;
          margin-top: 88rpx;
          display: flex;
          flex-direction: column;
          padding: 16rpx 40rpx 16rpx 40rpx;
          .text_4 {
            overflow-wrap: break-word;
            color: rgba(255, 255, 255, 1);
            font-size: 28rpx;
            font-family: PingFang-SC-Medium;
            font-weight: normal;
            text-align: left;
            white-space: nowrap;
            line-height: 40rpx;
          }
        }
      }
      .title {
        color: #999999;
        font-size: 28rpx;
        margin-left: 32rpx;
      }
      .score {
        font-weight: 600;
        font-size: 72rpx;
        color: #333333;
        margin-bottom: 16rpx;
        margin-left: 32rpx;
        margin-top: 48rpx;
      }
    }

    .scorebtn {
      position: absolute;
      right: 32rpx;
      bottom: 32rpx;
      width: 176rpx;
      height: 60rpx;
      border-radius: 30rpx;
      background-color: #0d0d0d;
      text-align: center;
      line-height: 60rpx;
      color: #fff;
      font-size: 28rpx;
      margin: 0 auto;
    }
  }
  .navList {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 16rpx;
    align-self: center;
    margin-top: 24rpx;
    width: 702rpx;
    display: flex;
    flex-direction: column;
    padding: 24rpx 62rpx 8rpx 54rpx;
    margin: 0 auto;
    margin-bottom: 20rpx;
    box-sizing: border-box;
    .navContent{
      flex-direction: row;
      display: flex;
      justify-content: space-between;
      .text_5 {
        overflow-wrap: break-word;
        color: rgba(51, 51, 51, 1);
        font-size: 32rpx;
        font-family: PingFang-SC-Bold;
        font-weight: normal;
        text-align: right;
        white-space: nowrap;
        line-height: 44rpx;
      }
      .navActive {
        font-weight: bold;
        ::after {
          content: "";
          display: block;
          width: 50rpx;
          height: 10rpx;
          background: rgba(112, 110, 238, 1);
          margin: 0 auto;
          margin-top: 15rpx;
          border-radius: 25rpx;
        }
      }
    }
  }
  .getHuiDou {
    background-color: rgba(255, 255, 255, 1);
    border-radius: 16rpx;
    align-self: center;
    width: 702rpx;
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 32rpx;
    margin: 0 auto;
    box-sizing: border-box;
    .dayTask {
      width: 126rpx;
      margin-right: 512rpx;
      flex-direction: row;
      display: flex;
      justify-content: space-between;
      .thumbnail_5 {
        width: 6rpx;
        height: 24rpx;
        margin: 8rpx 0 8rpx 0;
        background-color: #706eee;
      }
      .text_Title {
        overflow-wrap: break-word;
        color: rgba(51, 51, 51, 1);
        font-size: 28rpx;
        font-family: PingFang-SC-Bold;
        font-weight: bold;
        text-align: left;
        white-space: nowrap;
        line-height: 40rpx;
      }
    }
    .marginTopDay{
      margin-top: 50rpx;
    }
    .box_item {
      width: 638rpx;
      margin-top: 32rpx;
      flex-direction: row;
      display: flex;
      justify-content: space-between;
      border-bottom: 2rpx solid #e4e4e4;
      padding-bottom: 30rpx;
      .text-group {
        display: flex;
        flex-direction: column;
        .text_Title {
          overflow-wrap: break-word;
          color: rgba(51, 51, 51, 1);
          font-size: 28rpx;
          font-family: PingFang-SC-Bold;
          font-weight: bold;
          text-align: left;
          white-space: nowrap;
          line-height: 40rpx;
        }
        .text_des {
          overflow-wrap: break-word;
          color: rgba(102, 102, 102, 1);
          font-size: 24rpx;
          font-family: PingFang-SC-Medium;
          font-weight: normal;
          text-align: left;
          white-space: nowrap;
          line-height: 34rpx;
          margin-top: 8rpx;
        }
      }
      .text-wrapper_btn {
        background-color: rgba(237, 237, 255, 1);
        border-radius: 30rpx;
        display: flex;
        flex-direction: column;
        margin: 12rpx 0 12rpx 0;
        padding: 14rpx 36rpx 14rpx 36rpx;
      }
      .diyBg{
          background-color: #c2c2c26e;
      }
    }
    .box_item:last-child{
      border: none;
      padding-bottom: 0rpx;
    }
  }
}
.bg {
  width: 702rpx;
  background: #fff;
  border-radius: 16rpx;
  margin: 0 auto;
  // padding: 0 32rpx;
  // box-sizing: border-box;
}
.mt30 {
  margin-top: 30rpx;
}
.c_sed {
  color: #fdefbb;
}
.item {
  height: 140rpx;
  align-items: center;
  // border-bottom: 1px solid #333;
  .col_18 {
    box-sizing: border-box;
    padding-left: 20rpx;
    .time {
      margin-top: 20rpx;
      font-size: 24rpx;
      color: #999999;
    }
    .type {
      font-size: 32rpx;
      color: #333333;
      font-weight: bold;
    }
  }
  .col_6 {
    text-align: right;
    padding-right: 20rpx;
    box-sizing: border-box;
  }
}
.add {
  font-size: 28rpx;
  color: #706EEE;
  &:before {
    content: "+";
  }
}
.reduce {
  color: #333333;
}
.text_btn {
  overflow-wrap: break-word;
  color: rgba(112, 110, 238, 1);
  font-size: 24rpx;
  font-family: PingFang-SC-Bold;
  font-weight: normal;
  text-align: right;
  white-space: nowrap;
  line-height: 34rpx;
}
.diyColor{
  color: #aaaaaa;
}

.sign_box{
	
	width: 75vw;
	position: relative;
	image{
		width: 100%;
		height: 100%;
	}
	.sign_img{
		background: #FFFFFF;
		border-radius: 32rpx 32rpx 0 0;
	}
	.sign_info{
		padding: 40rpx 54rpx 32rpx;
		background: #FFFFFF;
		border-radius: 0 0 32rpx 32rpx;
		.sign_tit{
			font-weight: bold;
			font-size: 42rpx;
			text-align: center;
			color: #092158;
		}
		.sign_num{
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 24rpx 0 18rpx;
			.num_icon{
				width: 48rpx;
				height: 48rpx;
				margin-right: 8rpx;
				
			}
			.num_count{
				font-weight: bold;
				font-size: 48rpx;
				color: #706EEE;
			}
		}
		.sign_lit{
			text-align: center;
			font-weight: 500;
			font-size: 28rpx;
			color: #4F5F83;
		}
		.sign_btn{
			margin-top: 32rpx;
			text-align: center;
			background: #706EEE;
			border-radius: 44rpx;
			padding: 22rpx 0;
			font-weight: bold;
			font-size: 32rpx;
			color: #FFFFFF;
		}
	}
	.sign_close{
		width: 60rpx;
		height: 60rpx;
		position: absolute;
		bottom: -88rpx;
		left: 50%;
		transform: translate(-50%,0%);
	}
}
</style>